//导入Ajax
import {
    ajax,
    isObject
} from "./ajax.js"
//创建全局下的对象，储存获取的数据
var bookstack = {}
//判断是否有参
var value1 = unescape(window.location.href.split("?")[1])

var bclass = ""
var way = ""
if(window.location.href.split("?")[1]){
    var value2 = value1.split("&")
    way = value2[0].split("=")[1]
    if(value2[1].split("=")[1]=="bigNav1"){
        bclass = "童书育儿"
    }else if(value2[1].split("=")[1]=="bigNav2"){
        bclass = "文学小说"
    }else if(value2[1].split("=")[1]=="bigNav3"){
        bclass = "社科经管"
    }else if(value2[1].split("=")[1]=="bigNav4"){
        bclass = "行业职业"
    }else if(value2[1].split("=")[1]=="bigNav5"){
        bclass = "教材教辅"
    }else if(value2[1].split("=")[1]=="bigNav6"){
        bclass = "生活艺术"
    }
}else{
    way = "all"
}

//调用ajax，获取搜索出的数据******************************
ajax({
    url: "./json/book.json",
    dataType: "json",
    data: "",
    type: "get",
    cache: false,
    //调用成功执行函数
    success: function (data) {
        //声明对象储存需要的数据
        var obj = {};
        //计数
        var j = 0;
        //判断是否需要break
        var twenty = false;

        //way = "all"时
        if(way == "all"){
        //遍历数据库
        for (var key in data) {

            for (var attr in data[key]) {

                for (var keyattr in data[key][attr]) {
                    obj[keyattr] = data[key][attr][keyattr]
                    obj[keyattr]['分类表'] = key + '.' + attr + '.' + keyattr;
                }

            }
        }
        //搜索出的书
        var str = ""
        for(var kk in obj){
            j++;
            if(j>20){
                break
            }
            str +=`
            <div class="daytabs-main-box">
            <div class="daytabs-main">
                <a href="./detail.html?bname=${escape(obj[kk]['分类表'])}" >
                    <img src=${obj[kk]["url"]} alt="">
                </a>
                <a href="./detail.html?bname=${escape(obj[kk]['分类表'])}">
                <p class="bookname">${kk}</p>
                </a>
                <div class="daytabs-price">
                    <span class="daytabs-p">
                    ${obj[kk]["文轩价"]}
                    </span>
                    <span class="daytabs-n">
                    ${obj[kk]["定价"]}
                    </span>
                </div>
                <p class="author">${obj[kk]["作者"]}</p>
                <p class="public">出版社：<span>${obj[kk]["出版社"]}</span></p>
                <p class="public-time">出版时间：<span>${obj[kk]["出版时间"]}</span></p>
            </div>
        </div>
            `
        }
        bookstack = obj
        $(".left-main").html(str)

        }else if(way== "bookclass"){
            for (var key in data[bclass]) {

                for (var attr in data[bclass][key]) {
    

                        obj[attr] = data[bclass][key][attr]
                        obj[attr]['分类表'] = bclass + '.' + key + '.' + attr;

    
                }
            }
        //搜索出的书
        var str = ""
        for(var kk in obj){
            j++;
            if(j>20){
                break
            }
            str +=`
            <div class="daytabs-main-box">
            <div class="daytabs-main">
                <a href="./detail.html?bname=${escape(obj[kk]['分类表'])}" >
                    <img src=${obj[kk]["url"]} alt="">
                </a>
                <a href="./detail.html?bname=${escape(obj[kk]['分类表'])}">
                <p class="bookname">${kk}</p>
                </a>
                <div class="daytabs-price">
                    <span class="daytabs-p">
                    ${obj[kk]["文轩价"]}
                    </span>
                    <span class="daytabs-n">
                    ${obj[kk]["定价"]}
                    </span>
                </div>
                <p class="author">${obj[kk]["作者"]}</p>
                <p class="public">出版社：<span>${obj[kk]["出版社"]}</span></p>
                <p class="public-time">出版时间：<span>${obj[kk]["出版时间"]}</span></p>
            </div>
        </div>
            `
        }
        bookstack = obj
        $(".left-main").html(str)
        }
    },
    error: function (x) {
        alert(x)
    }
})
//调用ajax，获取搜索出的数据******************************

//给按价格排序下的a标签添加点击事件******************
$(".pand-second a").on("click",function (e){
    //事件对象
    var e = e || window.event;
    //事件目标
    var target = e.target || e.srcElement;
    //价格范围
    var pricearr = [0,9999];
    var str = ""
    if(target.innerHTML=="价格"){
        pricearr = [0,9999]
    }else if(target.innerHTML=="0-9元"){
        pricearr = [0,9]
    }else if(target.innerHTML=="10-29元"){
        pricearr = [10,29]
    }else if(target.innerHTML=="30-49元"){
        pricearr = [30,49]
    }else if(target.innerHTML=="50-99元"){
        pricearr = [50,99]
    }else if(target.innerHTML=="100元以上"){
        pricearr = [100,9999]
    }else if(target.innerHTML=="不限"){
        pricearr = [0,9999]
    }

    //遍历获取的数据
    for(var key in bookstack){
        for(var attr in bookstack[key]){
            if(attr=="文轩价"){
                var com = bookstack[key][attr].split("￥")[1]
                if(com>=pricearr[0]&&com<=pricearr[1]){
                    str +=`
                    <div class="daytabs-main-box">
                    <div class="daytabs-main">
                        <a href="./detail.html?bname=${escape(bookstack[key]['分类表'])}" >
                            <img src=${bookstack[key]["url"]} alt="">
                        </a>
                        <a href="./detail.html?bname=${escape(bookstack[key]['分类表'])}">
                        <p class="bookname">${key}</p>
                        </a>
                        <div class="daytabs-price">
                            <span class="daytabs-p">
                            ${bookstack[key]["文轩价"]}
                            </span>
                            <span class="daytabs-n">
                            ${bookstack[key]["定价"]}
                            </span>
                        </div>
                        <p class="author">${bookstack[key]["作者"]}</p>
                        <p class="public">出版社：<span>${bookstack[key]["出版社"]}</span></p>
                        <p class="public-time">出版时间：<span>${bookstack[key]["出版时间"]}</span></p>
                    </div>
                </div>
                    `
                }
            }
        }
    }
    if(str){

    }else{
        str = "<h2 class='donot'> 不存在您选取的书</h2>"
    }
    $(".left-main").html(str)
    return false
})
$(".sort-item a").on("click",function (e){
    //事件对象
    var e = e || window.event;
    //事件目标
    var target = e.target || e.srcElement;
    //价格数组
    var pricearr = [];
    // 对象数组
    var objarr = [];
    //书名数组
    var booknamearr = [];
    var str = ""
    if(target.innerHTML=="综合排序"||target.innerHTML=="销量"){
        var k = 0 
    //遍历获取的数据
    for(var key in bookstack){



                    str +=`
                    <div class="daytabs-main-box">
                    <div class="daytabs-main">
                        <a href="./detail.html?bname=${escape(bookstack[key]['分类表'])}" >
                            <img src=${bookstack[key]["url"]} alt="">
                        </a>
                        <a href="./detail.html?bname=${escape(bookstack[key]['分类表'])}">
                        <p class="bookname">${key}</p>
                        </a>
                        <div class="daytabs-price">
                            <span class="daytabs-p">
                            ${bookstack[key]["文轩价"]}
                            </span>
                            <span class="daytabs-n">
                            ${bookstack[key]["定价"]}
                            </span>
                        </div>
                        <p class="author">${bookstack[key]["作者"]}</p>
                        <p class="public">出版社：<span>${bookstack[key]["出版社"]}</span></p>
                        <p class="public-time">出版时间：<span>${bookstack[key]["出版时间"]}</span></p>
                    </div>
                </div>
                    `
                    k++;


        if(k>=20){
            break
        }
    }
    }else if(target.innerHTML=="价格"){
    //遍历获取的数据
    var i = 0 ;
    for(var key in bookstack){
        for(var attr in bookstack[key]){
            if(attr=="文轩价"){
                var com = bookstack[key][attr].split("￥")[1];
                pricearr.push({"0":com,"1":i})
                objarr.push(bookstack[key])
                booknamearr.push(key)
                i++
            }
        }
    }
    function compare(p){ //这是比较函数
        return function(m,n){
            var a = m[p];
            var b = n[p];
            return a - b; //升序
        }
    }
    // 排序
    pricearr.sort(compare("0"))
    for(var j =0;j<pricearr.length&&j<20;j++){
        var num = pricearr[j]["1"];
            str +=`
            <div class="daytabs-main-box">
            <div class="daytabs-main">
                <a href="./detail.html?bname=${escape(objarr[num]['分类表'])}" >
                    <img src=${objarr[num]["url"]} alt="">
                </a>
                <a href="./detail.html?bname=${escape(objarr[num]['分类表'])}">
                <p class="bookname">${booknamearr[num]}</p>
                </a>
                <div class="daytabs-price">
                    <span class="daytabs-p">
                    ${objarr[num]["文轩价"]}
                    </span>
                    <span class="daytabs-n">
                    ${objarr[num]["定价"]}
                    </span>
                </div>
                <p class="author">${objarr[num]["作者"]}</p>
                <p class="public">出版社：<span>${objarr[num]["出版社"]}</span></p>
                <p class="public-time">出版时间：<span>${objarr[num]["出版时间"]}</span></p>
            </div>
        </div>
            `
    }
    }




    $(".left-main").html(str)
    return false
})

//给按价格排序下的a标签添加点击事件******************

//取消引入的滚动条事件
window.onload = null